<template>
  <!-- 费用（条码申请项目） -->
  <div id="wLapplicationItem">
    <Splitpanes horizontal>
      <Pane>
        <vxe-table ref="applicationItemTableList" v-loading="loading" border height="auto" :data="tableList" :footer-method="footerMethod" :merge-footer-items="[ { row: 0, col: 1, rowspan: 1, colspan: 5 } ]" :row-config="{ isCurrent: true, isHover: true }" :keyboard-config="{
            isArrow: true,
            isTab: true,
            isEdit: true
          }" footer-row-class-name="table-footer" show-footer resizable show-overflow>
          <!--          <vxe-column width="23">-->
          <!--            <template #default="{ row }">-->
          <!--              <i :class="[row.isAdditional ? 'el-icon-folder-add' : '']" class="cell-icon"></i>-->
          <!--            </template>-->
          <!--          </vxe-column>-->

          <!--          <vxe-column field="adviceCode" title="医嘱代号" width="120"></vxe-column>-->
          <!--          <vxe-column field="adviceName" title="医嘱名称" width="120"></vxe-column>-->
          <vxe-column field="feeCode" title="编号" width="100"></vxe-column>
          <vxe-column field="adviceId" title="申请号码" align="center" min-width="160"></vxe-column>
          <vxe-column field="feeName" title="收费项目" align="center" min-width="160"></vxe-column>

          <vxe-column field="amount" title="数量" width="80" align="right"></vxe-column>
          <vxe-column field="price" title="单价" width="80" align="right"></vxe-column>
          <vxe-column field="costs" title="金额" width="80" align="right"></vxe-column>
        </vxe-table>

      </Pane>
      <!--      <Pane size="45">-->
      <!--        <div :style="{ height: '100%' }">-->
      <!--          <vxe-table-->
      <!--              ref="specAdditionListTable"-->
      <!--              v-loading="additionLoading"-->
      <!--              border-->
      <!--              height="auto"-->
      <!--              :data="specAdditionList"-->
      <!--              :row-config="{ isCurrent: true, isHover: true }"-->
      <!--              :keyboard-config="{-->
      <!--              isArrow: true,-->
      <!--              isTab: true,-->
      <!--              isEdit: true-->
      <!--            }"-->
      <!--              resizable-->
      <!--              show-overflow-->
      <!--          >-->
      <!--            <vxe-column field="reqNo" title="条码号" width="160"></vxe-column>-->
      <!--            <vxe-column field="patId" title="病历号" width="160"></vxe-column>-->
      <!--            <vxe-column field="patNa" title="姓名" width="120"></vxe-column>-->
      <!--            <vxe-column field="sex" title="性别" width="40" align="center">-->
      <!--              <template #default="{ row }">-->
      <!--                {{ row.sex === '1' ? '男' : row.sex === '2' ? '女' : '未知' }}-->
      <!--              </template>-->
      <!--            </vxe-column>-->
      <!--            <vxe-column field="reqTime" title="申请时间" width="120"></vxe-column>-->
      <!--            <vxe-column field="testPurpose" title="检验目的" min-width="120"></vxe-column>-->
      <!--          </vxe-table>-->
      <!--        </div>-->
      <!--      </Pane>-->
    </Splitpanes>
  </div>
</template>
<script setup lang="ts">
import { getCurrentInstance, reactive, ref } from 'vue';
import { Pane, Splitpanes } from 'splitpanes';
import { IsEmpty } from '@/utils/common';
import { VxeMessage, VxeNotifyType } from '@/utils/CommonMessage';
import 'vxe-table/lib/style.css'

let { proxy }: any = getCurrentInstance();

let reqNo = ref(''); //接收传过来的检验结果id
let tableList = reactive([]);
let specAdditionList = reactive([]);
let loading = ref(false);
let additionLoading = ref(false);
let applicationItemTableList = ref(null);
defineExpose({
  getreqDetail, cleanData
})


function cleanData() {
  tableList.length = 0;
}

// 页面加载列表
function getreqDetail(repData: any) {
  reqNo.value = '';
  if (!IsEmpty(repData.reqNo)) {
    reqNo.value = repData.reqNo;
  }
  getDetail();
  getReqAdditions();
}

// 获取项目费用明细
function getDetail() {
  tableList.length = 0;
  loading.value = true;
  const url = '/api/reqdetail/findReqDetailByReqNo';
  proxy.$http
    .get(url, { params: { reqNo: reqNo.value } })
    .then(async (res: any) => {
      loading.value = false;
      if (res.data && res.data.length > 0) {
        tableList.push(...res.data);
      }
    })
    .catch((err: any) => {
      VxeMessage(err, VxeNotifyType.error);
    });
}

//获取申请附加信息
function getReqAdditions() {
  specAdditionList.length = 0;
  additionLoading.value = true;
  const url = '/lab/reqMain/findLabReqAdditions';
  proxy.$http
    .get(url, { params: { reqNo: reqNo.value } })
    .then(async (res: any) => {
      additionLoading.value = false;
      if (res.data) {
        specAdditionList.push(...res.data);
      }
    })
    .catch((err: any) => {
      VxeMessage(err, VxeNotifyType.error);
    });
}

// 表尾
function footerMethod({ columns, data }) {
  let count = 0;
  tableList.forEach(item => {
    count += item.costs ? parseFloat(item.costs) : 0;
  });
  return [
    columns.map((column, _columnIndex) => {
      if (_columnIndex === 1) {
        return `金额合计: ${formatJe(count)}`;
      }
      return null;
    })
  ];
}

function formatJe(v) {
  if (Number.isNaN(v)) {
    return '';
  }
  return Number(v).toFixed(2);
}


</script>
<style lang="scss" scoped>
#wLapplicationItem {
  height: 100%;
}
</style>